<template>
  <div>
    <van-search
      placeholder="搜索"
      class="info_search input_text"
      v-model="value"
      @search="onSearch"
      @clear="clearSearch"
    ></van-search>
    <van-list
      v-bind:finished="myFinished"
      v-model="myLoading"
      finished-text="没有更多了"
      @load="myOnLoad"
    >
      <van-cell
        class="card"
        @click="openDetail(item)"
        v-for="(item, index) in myList"
        v-bind:key="index"
      >
        <div>
          <div>
            <van-row>
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_account.png" />
                姓名：{{ item.ChnName}}
              </van-col>
            </van-row>
            <van-row>
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_list_kind.png" />
                接害类型：{{ item.HurtType}}
              </van-col>
            </van-row>
            <van-row>
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_list_date.png" />
                体检时间：{{ item.CheckDate|formatDate }}
              </van-col>
            </van-row>
            <van-row>
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/icon_list_date.png" />
                下次体检时间：{{ item.NextCheckDate|formatDate }}
              </van-col>
            </van-row>
            <van-row>
              <van-col>
                <img class="icon" src="@/assets/Images/AppIcon/list_icon_template.png" />
                体检结果：{{item.CheckResult}}
              </van-col>
            </van-row>
            <!-- <van-row>
              <van-col>附件：{{item.CheckFile}}</van-col>
            </van-row> -->
          </div>
        </div>
      </van-cell>
    </van-list>
  </div>
</template>
<script>
import { nsCheckUserInfoList } from "@/api/ns";
import { List } from "vant";
export default {
  data() {
    return {
      value: "",
      myList: [],
      myFilter: {
        page: 0,
        dataType: "List"
      },
      loading: false,
      finished: false,
      myLoading: false,
      myFinished: false
    };
  },
  created() {
    this.getMyList();
  },
  methods: {
    onSearch() {
      var conditions1 = [];
      if (this.value) {
        conditions1.push({
          Name: "ChnName",
          DisplayName: this.value,
          value: this.value,
          Operator: "like",
          DataType: "String"
        });
      }
      this.myFilter.page = 0;
      this.myFilter.conditions = JSON.stringify(conditions1);
      this.getMyList();
    },
    clearSearch() {
      this.myFilter = {
        page: 0,
        dataType: "List"
      };
      this.value = "";
      this.getMyList();
    },
    getMyList() {
      this.myLoading = true;
      nsCheckUserInfoList(this.myFilter).then(res => {
        this.myLoading = false;
        if (!res.data.HasNextPage) {
          this.myFinished = true;
        }
        this.myList = res.data.Data;
        this.myFilter.page = res.data.PageIndex;
      });
    },
    myOnLoad() {
      this.myLoading = true;
      ++this.myFilter.page;
      list(this.myFilter).then(res => {
        this.myLoading = false;
        this.myFilter.page = res.data.PageIndex;
        this.myList = this.myList.concat(res.data.Data);
        if (!res.data.HasNextPage) {
          this.myFinished = true;
        }
      });
    },
    openDetail(item) {
      this.$router.push({
        path: "/NsCheckUserInfoView",
        query: { id: item.ID }
      });
    }
  }
};
</script>

<style lang="less">
.info_search {
  padding: 10px;
  border-radius: 5px !important;
}
</style>